// 人员信息
<template>
    <f7-page class="hntsh">
        <f7-navbar>
            <f7-nav-left>
                <f7-link back icon-material="chevron_left" force></f7-link>
            </f7-nav-left>
            <f7-nav-title>人员信息</f7-nav-title>
            <f7-nav-right> </f7-nav-right>
        </f7-navbar>
        <div class="content-list">
            <v-accordion
                title="基本信息"
                class="infoList"
                style="margin-top: 0;"
            >
                <van-form input-align="right" ref="form" :readonly="true">
                    <van-field
                        v-model="models.model.personType"
                        readonly
                        label="人员类型"
                    >
                        <div slot="input" class="input-cell">
                            {{models.model.personType|DictItem(controlData.personTypeEnum,'key','value')}}
                        </div>
                    </van-field>
                    <van-field
                        v-model="models.model.personName"
                        label="姓名"
                        rows="1"
                        autosize
                        type="textarea"
                        placeholder="请输入"
                    >
                    </van-field>
                    <van-field
                        v-model="models.model.personIdcard"
                        label="身份证号"
                        rows="1"
                        autosize
                        type="textarea"
                        placeholder="请输入"
                    >
                    </van-field>
                    <van-field
                        v-model="models.model.personMobile"
                        label="联系方式"
                        type="number"
                        placeholder="请输入"
                    >
                    </van-field>
                    <van-field
                        v-model="models.model.enterpriseName"
                        label="所属单位"
                        rows="1"
                        autosize
                        type="textarea"
                        placeholder="请输入"
                    >
                    </van-field>
                    <!-- <div>
                        <qm-file-upload
                            ref="ReturnPic"
                            :galleryOptions="{ multiple: false, maximum: 1 }"
                            :disabled="isWrite"
                            :params="{
                                type: 'attach',
                                dataKey: models.model.personId,
                                bizType: 'SOCIAL_SECURITY_CERT',
                            }"
                            uploadId="file2"
                            extensions="jpg,jpeg,png"
                            accept=".jpg,.jpeg,.png"
                        >
                        </qm-file-upload>
                        <p style="margin: 0 20px 20px 25px;">社保证明</p>
                    </div> -->
                </van-form>
            </v-accordion>
            <v-accordion
                title="人脸采集"
                class="infoList face-list"
                :disabled="true"
            >
                <span slot="accordion-title-right" class="tag tag-blue-fill" @click="faceCollect">
                    {{!models.model.personPhotoAttachId?'待采集':'重新采集'}}
                </span>
                <div style="padding:20px;">
                    <div class="img-box" v-if="!models.model.personPhotoAttachId">待采集</div>
                    <img class="img-box" v-else :src="$util.getImgSrc(models.model.personPhotoAttachId)" />
                    <div style="width: 90px;text-align: center;">人脸采集照</div>
                </div>
            </v-accordion>
            <!-- <f7-toolbar
                position="bottom"
                no-shadow
                class="fff"
            >
                <f7-button
                    fill
                    class="submit-btn"
                    @click="sure()"
                    v-if="!isWrite"
                    >提交</f7-button
                >
                <f7-button
                    fill
                    class="submit-btn"
                    @click="comeBack()"
                    v-if="models.model.auditStatus == 2"
                    >撤销，重新绑定</f7-button
                >
            </f7-toolbar> -->
        </div>
    </f7-page>
</template>

<script>
import controller from '@/libs/framework/workflowController'
export default class instance extends controller {
    onBeforeInit() {
        this.urls = {
            model: '/ent/entPersonBase/getEntity',
        }
    }
    onInit() {}
    onAfterQuery(type, isSuccess, result) {
        return result
    }

    onAfterSave(isSuccess, result) {
        
    }

    mixin() {
        return {
            data() {
                return {
                    controlData: {
                        
                    },
                    models: {
                        model: {},
                    },
                    pageAction: '',
                }
            },
            computed: {
                isWrite() {
                    return false
                },
            },
            mounted() {},
            methods: {
                // 人脸采集
                faceCollect(){
                    if(this.$util.isUmSdk()){
                        let that=this
                        umSdk.startFaceCollect({
                            success: function(res) {
                                localStorage.setItem('res--',JSON.stringify(res))
                                console.log('11111-----',res.data.faceUrl) // 人脸图片的链接地址
                                let postParam={
                                    personId:that.models.model.personId,
                                    faceUrl:res.faceUrl
                                }
                                that.$util.getPromise('/mobileApi/base/account/downloadFace', postParam)
                                .then(result => {
                                    if(result&&result.success&&result.parameters&&result.parameters.attach){
                                        const { attachmentId } = result.parameters.attach
                                        that.models.model.personPhotoAttachId = attachmentId
                                        that.$f7.dialog.toast("人脸采集成功")
                                    }else{
                                        that.$f7.dialog.toast("人脸采集失败")
                                    }
                                })
                                .catch(e=>{
                                    localStorage.setItem('系统自己的报错e--',JSON.stringify(e))
                                    console.log(e);
                                    that.$f7.dialog.toast("人脸采集失败")
                                });
                            },
                            fail: function(err) {
                                localStorage.setItem('人脸采集报错err--',JSON.stringify(err))
                            }
                        })
                    }
                },
            },
        }
    }
}
</script>

<style lang="less" scoped>
@import '~@/assets/css/qualityCreate.less';
@deep: ~'>>>';

@{deep} .page-content {
    padding-top: 0;
}

@{deep} .van-popup {
    background-color: #f0f2f5;
}

@{deep} .van-swipe-cell__right {
    display: flex;
}

.hntsh {
    @{deep}.accordion .item-content {
        border-bottom: 1px solid #e3e5e9;
    }

    .content-list {
        padding: 44px 0 50px;
    }

    @{deep} .pic_upload {
        padding-top: 10px;
    }

    @{deep} .toolbar,
    @{deep}.navbar {
        position: fixed;
    }

    .tip {
        color: #fc3a39;
        background-color: rgba(252, 58, 57, 0.1);
        padding: 4px;
        margin: 5px 10px;
    }
}

.content-box {
    padding: 12px 16px;
    margin-bottom: 10px;
    font-size: 13px;
    background: #fff;

    .total-top {
        display: flex;
        align-items: center;

        .total-top-right {
            margin-left: 10px;
        }
    }

    .total-top,
    .total-middle {
        margin-bottom: 10px;

        .code,
        .tag-box .number {
            font-weight: 600;
            color: #242424;
            font-size: 14px;
        }

        .number {
            font-size: 12px;
            color: #909db6;
            font-weight: 400;
        }

        .tag {
            border-radius: 2px;
            color: #61677a;
            border-color: rgba(115, 125, 138, 0.1);
            background-color: rgba(115, 125, 138, 0.1);
            margin-top: 4px;
            display: inline-block;
        }
    }

    .total-bottom {
        font-size: 14px;
        font-weight: 400;
        color: #8995ac;

        .name-box {
            margin-bottom: 5px;
        }
    }
}
.infoList{
    .img-box{
        width: 90px;
        height: 90px;
        line-height: 90px;
        background: #f0f6ff;
        text-align: center;
        margin-right: 15px;
        letter-spacing: 1px;
        font-size: 14px;
    }
    .tag.tag-blue-fill {
        background: #eef6ff;
        color: #2196f3;
        border: none;
        padding: 4px 6px;
    }
    &.face-list{
        ::v-deep .item-link{
            .item-inner{
                padding-right: 20px;
            }
        }
    }
}
</style>
